<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>修改密码</title>
    <link href="${request.contextPath}/imgs/favicon.ico" type="image/x-icon" rel="shortcut icon"/>


    <!--bootstrap与validation样式和JS-->
    <link href="../bootstrap-3.3.7-dist/css/bootstrapValidator.min.css" rel="stylesheet">
    <link href="../bootstrap-3.3.7-dist/css/bootstrap.min.css" rel="stylesheet">
    <script src="../js/jquery-3.2.1.min.js"></script>
    <script src="../bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
    <script src="../bootstrap-3.3.7-dist/js/bootstrapValidator.min.js"></script>

    <!--弹出框-->
    <script src="../js/sweetalert.min.js"></script>
    <link rel="stylesheet" type="text/css" href="../css/sweetalert.css">


    <!--使用JS获取项目根路径http://localhost:8080-->
    <script>
        var path = "";
        $(function () {
            var strFullPath = window.document.location.href;
            var strPath = window.document.location.pathname;
            var pos = strFullPath.indexOf(strPath);
            var prePath = strFullPath.substring(0, pos);
            var postPath = strPath.substring(0, strPath.substr(1).indexOf('/') + 1);
            path = prePath ;
        });
    </script>

    <style>
        /*确认和取消按钮的距离*/
        .btn-default {
            color: #333;
            background-color: #fff;
            border-color: #ccc;
            margin-left: 120px;
            margin-right: 120px;
        }
    </style>

    <script>
        $(function () {
            //bootstrap校验
            $('form').bootstrapValidator({
                message: 'This value is not valid',
                feedbackIcons: {
                    valid: 'glyphicon glyphicon-ok',
                    invalid: 'glyphicon glyphicon-remove',
                    validating: 'glyphicon glyphicon-refresh'
                },
                fields: {
                    userPassword: {
                        message: '密码验证失败',
                        validators: {
                            identical: {
                                field: 'userPassword1',
                                message: '两次输入的密码不相符'
                            },
                            notEmpty: {
                                message: '密码不能为空'
                            },
                            stringLength: {
                                min: 6,
                                max: 12,
                                message: '密码长度必须在6到12位之间'
                            }
                        }
                    },
                    userPassword1: {
                        message: '密码验证失败',
                        validators: {
                            identical: {
                                field: 'userPassword',
                                message: '两次输入的密码不相符'
                            },
                            notEmpty: {
                                message: '密码不能为空'
                            },
                            stringLength: {
                                min: 6,
                                max: 12,
                                message: '密码长度必须在6到12位之间'
                            }
                        }
                    }
                }
            });

            //获取带过来的参数值，设置到隐藏域中
            function getParaValue() {
                var urlinfo = window.location.href; //获取当前页面的url
                var len = urlinfo.length;//获取url的长度
                var offset = urlinfo.indexOf("?");//设置参数字符串开始的位置
                var newsidinfo = urlinfo.substr(offset, len)//取出参数字符串 这里会获得类似“id=1”这样的字符串
                var newsids = newsidinfo.split("=");//对获得的参数字符串按照“=”进行分割
                var newsid = newsids[1];//得到参数值
                //var newsname = newsids[0];//得到参数名字
                return newsid;
            }

            $("#userId").val(getParaValue());
        });
    </script>

</head>
<body>

<div class="jumbotron text-center">
    <h2>重置您的密码</h2>
    <p>为了验证您的新密码，请认真填写以下每一项：</p>

    <p>密码区分大小写，为6-12个字符，最好由大小写字母、数字和特殊字符构成。</p>

    <form class="form-horizontal" id="resetForm">

        <!--用户Id通过隐藏域带过去表单-->
        <input type="hidden" id="userId" name="userId">

        <div class="form-group  ">
            <label for="inputEmail3" class="col-sm-2 control-label">新密码</label>
            <div class="col-sm-10">
                <input type="password" class="form-control" id="inputEmail3" name="userPassword" placeholder="新密码">
            </div>
        </div>
        <div class="form-group">
            <label for="inputPassword3" class="col-sm-2 control-label">确认密码</label>
            <div class="col-sm-10">
                <input type="password" class="form-control" id="inputPassword3" name="userPassword1" placeholder="确认密码">
            </div>
        </div>
        <div class="form-group ">
            <div class="col-sm-offset-2 col-sm-10">
                <button type="button" class="btn btn-default" id="submitButton" onclick="submitReset()">确认</button>
                <button type="button" class="btn btn-default" onclick="cancelReset()">取消</button>
            </div>
        </div>
    </form>
</div>

<script type="text/javascript">


    function submitReset() {

        $.ajax({
            url: path + "/user/resetPassword.do",
            type: "post",
            data: $("#resetForm").serialize(),
            success: function (responseText) {
                console.log(responseText);
                if (responseText.message == "修改成功") {
                    sweetAlert("修改密码成功");
                    $("#submitButton").attr("disabled", "disabled");
                    window.location.href = path + "/common/countDown.html";
                } else {
                    sweetAlert("修改密码失败");
                }
            },
            error: function () {
                sweetAlert("系统错误");
            }
        });
    }
    /*点击取消、返回首页*/
    function cancelReset() {
        window.location.href = path + "/index.html";

    }
</script>
</body>
</html>